@charset "utf-8";
.guanyu{ width:100%; height:550px;  padding-top:50px;}
.guanyu2{ width:94%; height:550px; margin:0 auto;}
.zuotu{width:577px; height:445px; float:left;  text-align:left;}
.youzi{width:59%; height:445px; float:left; padding-left:2%; line-height:39px; text-align:justify; }
.card3 {           
           border-radius: 0px;
            box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);           
            border: 1px solid rgba(255, 255, 255, 0.1);          
            cursor: pointer;
            transition: transform 0.3s, box-shadow 0.3s;
            height: 325px; width:100%; margin-bottom:20px;  
        }
.card3:hover {
            transform: translateY(-10px);
            box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
        }
		
		.card2 {           
           border-radius: 0px;
             
            cursor: pointer;
            transition: transform 0.3s, box-shadow 0.3s;
            height: 325px; width:100%; margin-bottom:20px;  
        }
.card2:hover {
            transform: translateY(-10px);
           
        }
  
.xinwen{ width:100%; height:480px; }
.xinwen2{ width:93%; height:511px; margin:0 auto; }

.xinwen3 img{ width:100%; height:auto; } 

.xinwen4 img{ max-width: 100%; height:260px;}
.xinwen4a{ width:480px; height:350px; text-align:right; padding-left:10px}
.yuanjiao{border-radius:5%;}
.xinwen5{ width:60%; height:200px; float:left; margin-top:40px; }
.xinwen5d{ width:100%; height:30px; border-bottom: 1px solid #F1F1F1; margin-bottom:12px; }

.cengdiv {
  position: relative;
  top: -78px; /* 向下移动20px */
  left: 38px; /* 向右移动40px */
  height: 50px; width:442px;
  z-index:9999;color: #062951; font-size:16px; background-color: rgba(255, 255, 255, 0.8); line-height: 50px; padding-left: 9px;
}
.yyss{color: #062951; font-weight:bold;}
.dibu{ height:230px; width:100%; background-color:#EDEFF0; }
.dibu2{ height:230px; width:98%; margin:0 auto;  }
.zuo{ float:left; width:40%; height:230px; padding-top:30px; }
.you{ float:left;width:53%; height:200px; padding-top:30px; padding-left:5%; }
.you2{ float:left; padding-right:18%; height:200px;   } 
.xia{ border-top:1px solid #DBDBEA;  height:50px;background-color:#EDEFF0; line-height:50px;width:100%; font-size:16px; }
.shang2{ font-size:16px; width:300px;}
.shang{ height:230px; width:100%; border-bottom: 1px solid #CACAD9;}
.zuo1{ float:left; width:50%;}
.zuo2{ float:left; text-align:right; padding-top:10px; width:45%; padding-right:5%; }
.shang2a{ width:100%;  height:40px; padding-left:20px;}
.shang2aa{ float:left; width:50px; }
.shang2aaa{ float:left; }
.shang1{ padding-bottom:20px; height:100px;}
.zhong{border-right: 1px solid #CACAD9; width:1%; height:230px; float:left;}
.xia1{ height:50px; width:41.15%; float:left;border-right:1px solid #DBDBEA; }
.xia2{ height:50px; width:45%;float:left; line-height:50px; padding-left:68px;}


.weizhi{ font-size:16px; width:94%; height:20px; padding-left:3%; padding-right:3%; padding-top:30px; padding-bottom:0px;background-color:#F7F7F7;}
.weizhiw{ font-size:16px; width:94%; height:20px; padding-left:3%; padding-right:3%; padding-top:30px; padding-bottom:0px; padding-bottom:50px; }
.weizhi2{ font-size:26px; width:94%; height:50px; padding-left:3%; padding-right:3%;background-color:#F7F7F7;}
.weizhia{ font-size:16px; width:94%; height:50px;}
.weizhi2a{ font-size:26px; width:94%; height:50px; }
.weizhi3{ font-size:26px; width:94%; height:50px; padding-left:3%; padding-right:3%;background-color:#F7F7F7; padding-top:50px; padding-bottom:0px;}
.weizhi4{ font-size:26px; width:94%; height:50px; padding-left:3%; padding-right:3%; padding-top:30px; padding-bottom:0px;}
.chuanbo{ height:1000px; width:100%; background-color:#F7F7F7;}
.dakuang{ height:365px; width:23%; background-color:#fff; float:left; margin-right:1%; margin-bottom:40px; margin-left:12px; margin-top:15px;}
.dakuang2{ height:325px; width:20.5%; line-height:30px;color:#FFFFFF; font-size:18px; padding:20px; background-image:url(../img/bbjj.jpg);float:left; margin-right:1%;  margin-left:12px; margin-top:15px; }
.toukuang{ height:120px; width:100%; background-color:#9A2236; color:#FFFFFF;  }
.neirong{height:235px; width:88%; background-color:#fff; font-size:16px; line-height:30px; padding-top:10px; padding-left:18px;padding-right:18px;}
.chuanbo2{ width:92%; height:800px; margin:0 auto; padding-top:20px;}
.shuzi{ height:30px; width:100%; color:#B15263; font-size:25px;  padding-bottom:0px; padding-top:10px; padding-left:20px;}
.biaoti{ height:20px; width:100%;font-weight:bold; font-size:20px;padding-left:20px; padding-top:15px;}
.neirongx{ width:30%; margin:0 auto; height:100px; font-size:20px;  float:left; line-height:40px;text-align:justify; padding-top:40px;  padding-right:35px;}
.neirongx2{ width:66%; margin:0 auto;  text-align:center;float:left; padding-top:30px; height:400px; padding-bottom:50px; }
.neirongx3{ width:100%; margin:0 auto; height:600px;background-image:url(../img/bbjj2.jpg) }
.neirongx4{ width:94%; margin:0 auto; height:600px; font-size:18px; line-height:40px; margin-top:10px;}
.weizhi2x{ font-size:26px; width:94%; height:45px; padding-left:3%; padding-top:10px; }
.hxian{ height:3px; width:100px; background-color:#9B2236; margin-left:3%; margin-top:10px;}
.hxiana{ height:3px; width:150px; background-color:#9B2236; margin-left:3%; margin-top:3px;}
.hxianb{ height:3px; width:205px; background-color:#9B2236; margin-left:3%; margin-top:3px;}
.hxianc{ height:3px; width:240px; background-color:#9B2236; margin-left:3%; margin-top:10px;}
.hxiand{ height:3px; width:340px; background-color:#9B2236; margin-left:3%; margin-top:3px;}
.hxiane{ height:3px; width:102px; background-color:#9B2236; margin-top:0px; margin-bottom:50px; margin:0 auto;}
.hxianee{ height:3px; width:102px; background-color:#9B2236; margin-top:0px; margin-bottom:50px;margin-left:0.2%;}
.hxianf{ height:3px; width:105px; background-color:#9B2236; margin-left:0.5%; margin-top:10px;}
.hxiang{ height:3px; width:105px; background-color:#9B2236; margin-left:0%; margin-top:10px;}
.zuojie{ float:left; width:65%; padding-top:30px;}
.youjie{ float:left;width:30%; padding-left:5%;padding-top:30px;} 
.shijianzhou{ height:700px; width:100%; background-image:url(../img/fazhan.jpg)}
.ditu{ height:720px; width:100%;  }
.wenhua{ height:650px; width:96%; margin:0 auto; padding-top:20px; margin-bottom:20px; padding-left:4%; }
.wenhuacc{ height:650px; width:1280px; margin:0 auto; padding-top:20px; margin-bottom:20px; }
.wenhua2{ height:533px; width:350px; float:left; margin-right:75px; margin-top:30px;}
.wenhuax{ height:50px; width:96%; margin-top:30px;}

.xinwen{  height:auto; margin-bottom:200px; }
.xinwen2{ height:300px; width:94%; padding-left:1.3%;  }
.xinwenzt{ float:left; height:440px; width:30.5%;  margin-left:9.2%; margin-right:20px;}
.xinwenzt2{ float:left;height:200px; width:40%; padding-top:80px;margin-left:6%;}
.xinwena{ height:40px; width:100%; font-size:22px; }
.xinwenb{ height:40px; width:100%;  font-size:18px;}
.xinwenc{ height:40px; width:100%; font-size:18px;}
.xinwen3{ height:400px; width:32.5%; padding-top:20px; float:left; }
.xinwen4{ height:220px;   width:100%; }
.xinwen5{ height:100px;  width:100%; }
.xinwen5a{ height:auto; width:100%; padding-top:10px; text-align:left; font-size:16px; }
.xinwen5b{ height:auto; width:100%; text-align:left; font-size:20px;}
.xinwen5c{ height:auto; width:100%; text-align:left; font-size:16px; padding-top:15px;}


.xinwenv{ width:100%; height:480px; }
.xinwen2v{ width:100%; height:511px; margin:0 auto 0 auto; }
.xinwen3v{ width:100%; height:50px;}
.xinwen4v{ width:500px; height:360px; float:left;  }
.xinwen4av{ width:100%; height:350px; text-align:left; padding-left:8%;}
.yuanjiaov{border-radius:5%;}
.xinwen5v{ width:65%; height:200px; float:left;  }
.xinwen5dv{ width:96%; height:30px; border-bottom: 1px solid #F1F1F1; margin-bottom:12px; }
.xinwen5av{ width:20px; height:30px;  float:left; text-align:center; padding-top:0px;}
.xinwen5bv{ width:75%; height:30px; float:left;font-size:16px;}
.xinwen5cv{ width:15%; height:30px; float:right; text-align:right;font-size:16px; }

.xinwen3x{ width:75%; margin:0 auto; padding-bottom:50px; padding-top:30px;
     display: flex;
		    flex-flow: row wrap;
		    justify-content: space-between;
		    align-items: center;}
.xinwen3x:after{ 
		    content: "";
		    height: 0;
		    width: 32%;
		}
.xinwentiao{ height:50px; width:85%;border-bottom:1px solid #EDEDED;line-height:50px; margin:0 auto;}
.biaotix{ float:left;width:90%;line-height:50px;line-height:50px; font-size:16px;}
.shijian{ float:left; height:50px; width:10%; line-height:50px; text-align:right;}
.xinwenoem{ height:400px; margin-bottom:50px;}
.xinwen3xoem{ height:auto;margin-left:3%; margin-right:1%;  width:94%;}
.xinwen3xoem2{ height:auto;width:70%; line-height:30px; font-size:16px; margin: 0 auto; font-size:18px; line-height:30px;}
.biaotivv{ height:20px; }
.biaotivv01{ float:left; height:20px; width:455px; text-align:left; padding-left:2.3%;}
.biaotivv02{ float:left; height:20px; width:40%;text-align:left; padding-left:0.5%;}
.gaodu{ height:80px;}


        
        .link-card .btn {
            background: linear-gradient(to right, #4facfe, #00f2fe);
            color: white;
            padding: 12px 30px;
            border-radius: 50px;
            text-decoration: none;
            font-weight: 600;
            transition: all 0.3s ease;
            display: inline-block;
			cursor: pointer;‌right:0px;
        }
        
       
        /* 弹出层样式 */
        .overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;

            display: flex;
            justify-content: center;
            align-items: center;
            z-index: 1000;
            opacity: 0;
            visibility: hidden;
            transition: all 0.3s ease;
        }
        
        .overlay.active {
            opacity: 1;
            visibility: visible;
        }
        
        .popup {
            background: rgba(30, 40, 70, 0.95);
            border-radius: 10px;
            width: 30%;
            max-width: 800px;
            max-height: 90vh;
            overflow-y: auto;
            box-shadow: 0 15px 50px rgba(0, 0, 0, 0.5);
            transform: translateY(50px);
            opacity: 0;
            transition: all 0.4s ease;
            position: relative;
        }
        
        .overlay.active .popup {
            transform: translateY(0);
            opacity: 1;
        }
        
        .popup-header {
            padding: 10px 30px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.1);
            display: flex;
            justify-content: space-between;
            align-items: center;
			height:40px;
        }
        
        .popup-header h2 {
            font-size:20px;
            color: #feb47b;
            background: linear-gradient(to right, #ff7e5f, #feb47b);
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
        }
        
        .close-btn {
           
            color: #e74c3c;
            width: 45px;
            height: 45px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.5rem;
            cursor: pointer;
            transition: all 0.3s ease;
            
        }
        
        .close-btn:hover {
            background: rgba(231, 76, 60, 0.3);
            transform: rotate(90deg);
        }
        
        .popup-content {
            padding: 30px;
            line-height: 1.8;
            color: #c2e9fb;
        }

        
        /* 响应式设计 */
        @media (max-width: 768px) {
            .container {
                grid-template-columns: 1fr;
            }
            
            .header h1 {
                font-size: 2.5rem;
            }
            
            .popup-header {
                padding: 20px;
            }
            
            .popup-content {
                padding: 20px;
            }
        }
        
        .instructions {
            background: rgba(30, 40, 70, 0.7);
            border-radius: 15px;
            padding: 20px;
            margin-top: 30px;
            max-width: 800px;
            border: 1px solid rgba(255, 255, 255, 0.1);
        }
        
        .instructions h3 {
            color: #feb47b;
            margin-bottom: 15px;
            display: flex;
            align-items: center;
            gap: 10px;
        }
        
        .instructions ul {
            list-style: none;
            padding: 10px;
        }
        
        .instructions li {
            padding: 10px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.1);
            display: flex;
            gap: 15px;
        }
        
        .instructions li:last-child {
            border-bottom: none;
        }
        
        .instructions .icon {
            font-size: 1.5rem;
            color: #4facfe;
            min-width: 30px;
        }
        
        .footer {
            margin-top: 50px;
            text-align: center;
            color: rgba(255, 255, 255, 0.6);
            font-size: 0.9rem;
            padding: 20px;
        }
 .menuceng  {
    position: fixed;
    left: 0;
    top: 300px; /* 或者根据需要调整 */
    width: 30px; /* 设置宽度 */
    height: 30px; /* 使高度与视口高度一致 */
    background-color: lightgrey; /* 背景颜色，可选 */
	z-index:9999;
    /* 其他样式 */
}
 .overlay2 {
  position: fixed;
  top: 31%;
  left:2.5%;
  width: 200px;
  height: 100px;  
  display: flex;
  justify-content: center;
  align-items: center; 
  z-index: 1000; /* 确保在最上层 */
 
}
 
.popup2 {
  background: white;
  padding: 10px;
  border-radius: 8px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  z-index: 1001; /* 确保在遮罩层之上 */
  width:200px;
  background-color:#ECECFB;
}
.closeBtn{ background-color:#CC6600;}
.shengtai{ height:500px; width:94%;  margin:0 auto; padding-bottom:60px; }
.yewujieshao{ font-size:18px; text-align:center; padding-top:30px; }
.tiaook{ width:100%; height:10px; margin:0 auto;  }
.card {           
           border-radius: 0px;
            box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);           
            border: 1px solid rgba(255, 255, 255, 0.1);          
            cursor: pointer;
            transition: transform 0.3s, box-shadow 0.3s;
            height: 220px; width:350px; margin-bottom:20px; background-color:#FFFFFF;   
        }
.card:hover {
            transform: translateY(-10px);
            box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
        }
.card4 {           
           border-radius: 0px;
            box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);           
            border: 1px solid rgba(255, 255, 255, 0.1);          
            cursor: pointer;
            transition: transform 0.3s, box-shadow 0.3s;
            height: 15px; width:100%; margin-bottom:20px;  
        }
.card4:hover {
            transform: translateY(-10px);
            box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
        }
		
		

        /* 悬停触发区域 */
        .hover-trigger {
            position: fixed;
            top: 200px;
            left: 0;
            width: 30px;
            height: 98px;
            z-index: 900;
            transition: all 0.3s ease;
            cursor: pointer;
			background-color:#cccccc;
        }
        

        /* 侧滑导航容器 */
        .side-nav {
            position: fixed;
            top: 200px;
            left: -270px;
            width:250px;
            height: 180px;
            background: linear-gradient(to bottom, #DDDDDD,#DDDDDD);
           
            z-index: 1000;
            transition: all 0.1s;
            display: flex;
            flex-direction: column;
            border-right: 1px solid rgba(255,255,255,0.1);
			padding-left:20px;
        }
        
        .side-nav.active {
            left: 0;
        }
        
   
        /* 主要内容区域 - 不受菜单影响 */
        .content {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0px;
            position: relative;
            z-index: 1;
        }
 
.nav-links{ padding-left:-100px; background-color:#DDDDDD; padding-top:30px;}
a.lianjieok:link {
	color: #000000;
}
a.lianjieok:visited {
	color: #000000;
}
a.lianjieok:hover {
	color: #fff;
}
a.lianjieok:active {
	color: #fff;
}
.xindaohang{ height:80px; width:80%; font-size:20px; line-height:80px; text-align:center; margin:0 auto;}

.nav-menu3 {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden; 
font-size:18px; 
height:80px;
color:#FFFFFF;
width:80%;
}
.nav-menu3 li {
  float: left; width:150px; height:50px; line-height:80px;color:#FFFFFF;
}
.nav-menu3 li a {
  display: block;
  color:#000;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size:18px; 
  color:#FFFFFF;
}
.nav-menu3 li a:hover {
   font-size:18px; border-bottom: 1px solid #F1F1F1; margin-bottom:12px height:80px; width:150px;
}


.nav-menu2 {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #fff;
}
.nav-menu2 li {
  float: left; width:160px; height:80px; line-height:80px;
}
.nav-menu2 li a {
  display: block;
  color:#000;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  
}
.nav-menu2 li a:hover {
   font-size:26px; background-color:#EEEEEE;border-bottom: 1px solid #F1F1F1; margin-bottom:12px height:30px; width:160px;
}
.daohang{ height:60px; width:100%; background-color:#FF0000;}
.dhjg{ height:100px; line-height:100px; background-color:#99CC00; width:100%;}

.dropdown {
  position: relative;
  display: inline-block;
  padding-top:41px;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  padding: 0px 0px;
  z-index: 1; font-size:16px;
}

.dropdown:hover .dropdown-content {
  display: block;line-height:50px; padding-top:20px; margin-left:-15px; 
}
.bianhua2 { height:50px; line-height:50px;  width:160px; background-color:#fff; font-size:16px;   }
.bianhua1 { height:50px; line-height:50px; width:160px; background-color:#F0F0F0;font-size:16px;}
.gekong{ padding-left:15px;}
.rotated-box {
  width: 40px;
  height: 40px;
  
  transform: rotate(90deg); /* 旋转90度 */
  transition: transform 0.5s ease; /* 平滑过渡效果 */
}
.jieshao{ height:500px;  width:100%; text-align:center; }
.biaotizi{ height:50px;  width:100%; text-align:center; font-size:30px; padding-top:80px;}
.biaotizic{ height:50px;  width:100%; text-align:center; font-size:30px; padding-top:80px;}
.biaotizi2{ height:100px;  width:100%; text-align:center; font-size:25px;}
.lianjiegd{ font-size:20px; font-weight:bold;}
.mulu{  width:100%; color:#FFFFFF;}
.tuqu1{ height:250px; width:80%; margin:0 auto;}
@media (min-width: 770px) {
.xiaoti{ height:50px; width:100%; font-size:20px; text-align:center;font-weight:bold;}
.xiaoti2{ height:50px; width:100%; font-size:15px; text-align:center;}
.neirongzi{ height:150px; width:80%; text-align:left; font-size:16px; margin:0 auto;}
.neirongzia{ height:auto; width:80%; text-align:left; font-size:16px; margin:0 auto;padding-top:30px;padding-bottom:30px;}
.neirongzix{ height:150px; width:80%; text-align:center; font-size:16px; margin:0 auto; padding-top:50px;}
.silianx{ height:200px; width:100%; background-color:#0f0909;}
.silian3x{height:200px; width:80%; margin:auto;}
.silian4x{ height:100px; width:24%;   float:left; margin-left:1%; }
.silian4x2{ height:50px; width:100%;  text-align:center; padding-top:10px; margin-top:50px;  }
.silian4x3{ height:30px; width:100%; text-align:center; color:#FFFFFF; padding-top:20px; font-size:16px;  }
.tupianqu{ height:500px; width:80%;  margin:0 auto;}
.tu1{ height:240px; width:49.5%; background-image:url(../img/m1.jpg); float:left; line-height:240px; text-align:center; font-size:25px; color:#FFFFFF;}
.tu2{ height:240px; width:49.5%; background-image:url(../img/m2.jpg); float:right; line-height:240px;text-align:center;font-size:25px;color:#FFFFFF;}
.tu3{ height:240px; width:32.8%; background-image:url(../img/m3.jpg);float:left; margin-top:10px;text-align:center; line-height:240px;font-size:25px;color:#FFFFFF;}
.tu4{ height:240px; width:32.8%; background-image:url(../img/m4.jpg);float:left;margin-left:0.8%;margin-top:10px; line-height:240px;text-align:center;font-size:25px;color:#FFFFFF;}
.tu5{ height:240px; width:32.8%;  background-image:url(../img/m5.jpg);float:right;margin-top:10px; line-height:240px;text-align:center;font-size:25px;color:#FFFFFF;}
.hezuo{ height:auto; background-color:#000000; padding-top:80px;}
.hezuo2{ height:auto; background-color:#000000; padding-top:80px;}
.xiaoti3{ height:50px; width:100%; font-size:25px; text-align:center; color:#fff; }
.xiaoti4{ height:100px; width:100%; font-size:20px; text-align:center;color:#fff;}
.xiaoti4a{ height:100px; width:100%; font-size:20px; text-align:center;color:#fff;}
.santu{ height:300px; width:80%; margin: 0 auto;}
.ditu1{height:240px; width:30%;border: 1px solid #DBDBEA; float:left;padding-left:1%; padding-top:20px; padding-right:1%; padding-bottom:20px;}
.ditu2{height:240px; width:30%;border: 1px solid #DBDBEA; float:left; margin-left:1%;padding-left:1%; padding-top:20px; padding-right:1%;padding-bottom:20px;}
.ditu3{height:240px; width:30%;border: 1px solid #DBDBEA; float:right;padding-left:1%; padding-top:20px; padding-right:1%;padding-bottom:20px;}
.ditu1x{height:350px; width:31%;border: 1px solid #DBDBEA; float:left;padding-left:1%; padding-top:20px; padding-right:1%; padding-bottom:20px;}
.ditu2x{height:350px; width:30%;border: 1px solid #DBDBEA; float:left; margin-left:1%;padding-left:1%; padding-top:20px; padding-right:1%;padding-bottom:20px;}
.ditu3x{height:350px; width:31%;border: 1px solid #DBDBEA; float:right;padding-left:0.8%; padding-top:20px; padding-right:1%;padding-bottom:20px;}
.bbtt{ color:#FFFFFF; font-size:20px; font-weight:bold; }
.bbtt2{ color:#FFFFFF; font-size:16px; height:auto; padding-bottom:20px; }
.bbtt2a{ color:#FFFFFF; font-size:16px; height:auto; padding-bottom:20px;}
.bbtt3{ color:#FFFFFF; font-size:16px;}
.dot2{width:15%; height；20px;}
.dot {
  width: 6px;
  height: 6px;
  background-color: #fff;
  border-radius: 50%;
  float:left; margin-top:10px; margin-right:7px; margin-left:15px;
}

.lie{ font-size:14px; float:left; width:85%;}
.container {
            max-width: 1200px;
            width: 100%;
            text-align: center;
        }
        

        .counter-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 30px;
            margin-bottom: 60px;
        }

        .counter-icon {
            font-size: 2.5rem;
            margin-bottom: 15px;
        }
        
        .counter-value {
            font-size: 4rem;
            font-weight: bold;
            margin: 0 0;
            height: 60px;
            display: flex;
            align-items: center;
            justify-content: center;
			float:left;
			margin-left:25%; 
			color:#ff000;
			background-color: ff9999;
        }
.shanghu{ height:100px; width:100%; background-color:#55555;}
.shushu1{font-size:46px;color:#ff0000; float:left; width:90px;font-weight:bold;}
.shushu2{font-size:46px;color:#ff0000; float:left; width:90px;font-weight:bold}
.shushu3{font-size:46px;color:#ff0000; float:left; width:138px;font-weight:bold}
.shushu4{font-size:46px;color:#ff0000; float:left; width:138px;font-weight:bold}
.gaogao1{height:80px; width:66%; padding-left:34%; }
.gaogao2{height:80px; width:66%; padding-left:34%;}
.gaohao3{height:80px; width:66%; padding-left:27%;}
.gaogao3{height:80px; width:66%; padding-left:27%;}
  .jiahao{float:left;  width:20%;  padding-top:16px; width:30px;font-weight:bold; font-size:16px;color:#ff0000;}
		.shuju{ height:100px; width:100%; font-size:30px; text-align:center; padding-top:100px;}
		        .counter-label {
            font-size: 1.2rem;
            opacity: 0.9;
			clear:both; 
        } 
		.shujux{ width:30%; height:30px; background-color:#CC3333;}
		.lianxi{ height:300px; width:100%; background-color:#000000;}
		.lianxi2{ height:50px; width:100%; text-align:center; color:#FFFFFF; font-size:30px; color:#FFFFFF; padding-top:50px; padding-bottom:80px;}
		.lianxi3{ height:50px; width:200px; margin:0 auto; font-size:20px; background-color:#DBDBEA; text-align:center; line-height:50px;border-radius:50px;border: 3px solid #fff;}
.gaishu{ height:200px; width:100%; background-color:#000000;  color:#FFFFFF; padding-top:90px;background-image:url(../img/heise.png);background-size: 100% 100%; }
.gaishubiaoti{ font-size:25px; height:50px;padding-left:10%;}
.gaishuneirong{ font-size:16px; height:50px;padding-left:10%;}
.gaishu2{ height:300px; width:100%;   padding-top:50px; }
.gaishua{ height:200px; width:65%; float:left;  font-size:20px;}
.gaishub{ height:200px; width:20%; float:left; padding-left:5%;}
.heitiao{ height:200px; width:100%; background-color:#000000; color:#FFFFFF; font-size:30px; text-align:center; line-height:200px;}
.heitiao2{ height:200px; width:100%; background-color:#000000; color:#FFFFFF; font-size:30px; text-align:center; padding-top:70px;}
.baitiao{ height:300px; width:80%;  margin:0 auto; padding-top:80px;}
.baitiao2{ height:300px; width:80%;  margin:0 auto; padding-top:80px; margin:0 auto; text-align:center; font-size:24px;}
.yiti{ height:200px; width:80%; margin:0 auto;}
.yiti2{ height:50px; width:100%; text-align:center; font-size:25px; padding-top:50px;}
.yiti3{ height:50px; width:100%; text-align:center; font-size:20px;}
.yiti4{ height:50px; width:100%; text-align:center; font-size:12px; color:#666666;}
.tulie{ height:auto; width:80%; margin:0 auto; background-color:#3333FF; }
.tulie2{ height:250px; width:18%; background-color:#00FFCC; float:left; margin-left:20px; margin-top:20px;  }
.geceng2{ height:100px; width:100%;}
.shuc{ height:200px; width:23%;  float:left; margin-left:2%;} 
.shuc1{ height:50px; width:100%; font-size:34px; text-align:center; font-weight:bold; padding-bottom:10px;}
.shuc2{ height:50px; width:100%; font-size:20px; text-align:center; font-weight:bold;}
.shuc3{ height:50px; width:100%; font-size:16px; text-align:center;}
.gaishubiaoti2{ font-size:25px; height:50px;padding-left:5%; padding-right:5%;}
.gaishuneirong2{ font-size:16px; height:50px;padding-left:5%;padding-right:5%; }
.yewu{ height:50px; width:100%; font-size:24px; text-align:center; padding-top:50px; padding-bottom:50px; }
.yewu2{ height:auto; width:96%; margin:0 auto;}
.ye{ float:left; height:300px; width:19%;  font-size:12px; padding-left:1%;}
.ye1{ height:60px; width:100%; line-height:60px;  font-size:12px; text-align:center; padding-bottom:10px; }
.ye2{  height:auto; width:100%;  font-size:12px;text-align:center;font-size:16px;padding-bottom:20px; font-weight: bold;}
.ye3{ height:auto; width:90%;  font-size:12px;text-align:center; padding-left:5%; padding-right:20px; line-height:25px; }
.geceng{ clear:both;}
 
.mingjia{ height:650px; width:100%; background-color:#000;}
.tuandui{ height:400px;background-image:url(../img/tuandui.jpg);}
.xiabu{ height:250px; width:100%; background-color:#000000; color:#FFFFFF; text-align:center; padding-top:80px;}
.zuo{ height:200px; width:45%; float:right; color:#FFFFFF;font-size:16px;}
.you{ height:200px; width:45%;float:right;   }
.gunayux{ font-size:24px;}
.dibu2{ height:100px; padding-top:60px;font-size:14px; text-align:center;}
.dabiao{text-align:center; font-size:38px;}
.dabiao2{text-align:center; font-size:25px;}
.dongtaigu{ height:450px; width:80%; margin:0 auto;}
.dshu{ height:120px; width:20%; float:left; text-align:center; margin-top:50px; margin-left:4%;}
.dshu2{ font-size:25px; font-weight:bold; padding-top:20px; font-size:25px;}
.dshu3{ font-size:16px;}
.hangye{ height:50px; width:100%;  text-align:center; font-size:25px;}
.xinwen{ height:auto; width:75%;margin: 0 auto; margin-top:50px;}
.xinwen2{ height:250px; width:80%;}
.tutu{ height:100px; width:21%;float:left; margin-top:0px;}
.wenzi{ height:100px; width:70%; float:left;}
.wenzi1{ height:auto; width:100%; font-size:25px;}
.wenzi2{ height:50px; width:100%; font-size:14px;}
.guanyu{ height:700px; width:95%;}
.guanyu{ height:300px; width:95%;}
.guanyux{ height:400px; width:95%;}
.guanyua{ height:auto; width:95%;}
.gaishuneirongx{ font-size:16px; height:50px;padding-left:5%; padding-right:5%; font-size:18px;}
.fentu{ height:680px; width:23%; float:left;  margin-left:2%; margin-top:10px;}
.fentu2{ width:100%; height:480px; opacity: 0.8; }
.shangse{  width:100%; height:440px;opacity: 0.8; line-height:440px; text-align:center;  }
.fentu3{  width:100%; height:90px; font-size:18px; text-align:left; padding-top:10px;}
.fentu4{  width:100%; height:90px; font-size:12px; text-align:left; }
.qukuai{ min-height: 100%;  }
        :root {
            --primary-color: #4a6cf7;
            --secondary-color: #6b7280;
            --hover-color: #f3f4f6;
            --active-color: #e5e7eb;
            --text-color: #1f2937;
            --border-color: #d1d5db;
            --transition: all 0.3s ease;
        }

        

        .container {
            max-width: 85%;
            width: 100%;
            margin: 0 auto;
            padding-left: 4%;
        }

        /* 基础Tab样式 */
        .tabs-basic {
            display: flex;
            border-bottom: 1px solid var(--border-color); margin-left:2.6%; padding-left:4%;
            margin-bottom: 1.5rem;
        }

        .tab-btn {
            padding: 0.75rem 1.5rem;
            background: transparent;
            border: none;
            cursor: pointer;
            font-size: 1rem;
            color: var(--secondary-color);
            transition: var(--transition);
            position: relative;
        }

        .tab-btn:hover {
            color: var(--primary-color);
            background: var(--hover-color);
        }

        .tab-btn.active {
            color: var(--primary-color);
            font-weight: 600;
			
        }

        .tab-btn.active::after {
            content: '';
            position: absolute;
            bottom: -1px;
            left: 0;
            width: 100%;
            height: 3px;
            background: var(--primary-color);
            border-radius: 3px 3px 0 0;
			
        }

        .tab-content {
            display: none;
            padding: 1.5rem;
            animation: fadeIn 0.5s ease;  
        }

        .tab-content.active {
            display: block;
        }

       

        

        /* 动画效果 */
        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(10px); }
            to { opacity: 1; transform: translateY(0); }
        }

        /* 响应式设计 */
        @media (max-width: 768px) {
            .tabs-basic, .tabs-icons, .tabs-underline {
                flex-wrap: wrap;
            }
            
            .tab-btn, .tab-icon, .tab-underline {
                flex: 1 0 50%;
            }
            
            .tabs-rounded {
                width: 100%;
                overflow-x: auto;
            }
        }
.yingwen{text-align:center; font-size:25px;}  
.zhongwen{text-align:center; font-size:40px;}
}
        

       

        .trigger-btn {
            background: #cccccc;
            color: white;
            border: none;
            padding: 15px 40px;
            font-size: 1.2rem;
            border-radius: 50px;
            cursor: pointer;
           
            transition: all 0.3s ease;
            font-weight: 600;
        }
        
       
        
        .modal-overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.7);
            display: flex;
            justify-content: center;
            align-items: center;
            z-index: 1000;
            opacity: 0;
            visibility: hidden;
            transition: all 0.3s ease;
        }
        
        .modal-overlay.active {
            opacity: 1;
            visibility: visible;
        }
        
        .modal-content {
            background: white;
            width: 100%;
			height:100%;
            max-width: 100%;
            border-radius: 0px;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
            overflow: hidden;
            transform: scale(0.9);
            transition: transform 0.4s ease;
        }
        
        .modal-overlay.active .modal-content {
            transform: scale(1);
        }
        
        .modal-header {
            background: linear-gradient(to right, #6a11cb, #2575fc);
            color: white;
            padding: 10px;
            position: relative;
        }
        
        .modal-title {
            font-size: 1.5rem;
            font-weight: 600;
        }
        
        .close-btn {
            position: absolute;
            top: 15px;
            right: 20px;
            background: none;
            border: none;
            color: white;
            font-size: 1.8rem;
            cursor: pointer;
            width: 30px;
            height: 30px;
            display: flex;
            justify-content: center;
            align-items: center;
            border-radius: 50%;
            transition: background 0.3s;
        }
        
        .close-btn:hover {
            background: rgba(255, 255, 255, 0.2);
        }
        
        .modal-body {
            padding: 15px;
            text-align: left;
            line-height: 1.6;
            overflow: auto;
        }
        
        .modal-footer {
            padding: 15px 30px 30px;
            text-align: center;
        }
        
        .confirm-btn {
            background: #4CAF50;
            color: white;
            border: none;
            padding: 12px 30px;
            border-radius: 50px;
            cursor: pointer;
            font-size: 1rem;
            font-weight: 600;
            transition: all 0.3s ease;
            box-shadow: 0 4px 10px rgba(76, 175, 80, 0.3);
        }
        
        .confirm-btn:hover {
            background: #45a049;
            transform: translateY(-2px);
            box-shadow: 0 6px 15px rgba(76, 175, 80, 0.4);
        }
        
        .tips {
            margin-top: 30px;
            color: rgba(255, 255, 255, 0.8);
            font-size: 0.9rem;
        }
        
        @media (max-width: 600px) {
            .modal-content {
                width: 100%;
            }
            
            h1 {
                font-size: 2rem;
            }
        }
.tiaowen{width:70%; height:50px;margin:0 auto;}
.tiaowen3{ float:left; width:70%;font-size:20px;}
.tiaowen4{ float:left;width:20%;font-size:15px;color:#99999}
.bianse{
        -webkit-filter: grayscale(100%);
        -moz-filter: grayscale(100%);
        -ms-filter: grayscale(100%);
        -o-filter: grayscale(100%);
        filter: grayscale(100%);
        filter: gray;
      }
.container2{ width:80%; margin:0 auto; padding-left:3%;}
@media(max-width: 770px) {
    .container2{ width:50%; margin:0 auto; }
.biaotizi{ height:50px;  width:100%; text-align:center; font-size:20px; padding-top:30px; font-weight:bold;}
.biaotizic{ height:50px;  width:90%; text-align:center; font-size:20px; padding-top:30px; font-weight:bold;  margin:0 auto;}
.biaotizi2{ height:50px;  width:100%; text-align:center; font-size:15px;padding-top:30px; }
.neirongzi{ height:220px; width:90%; text-align:left; font-size:16px; margin:0 auto;}
.neirongzia{ height:auto; width:80%; text-align:left; font-size:16px; margin:0 auto;padding-top:30px;padding-bottom:30px;}
.neirongzix{ height:150px; width:80%; text-align:center; font-size:16px; margin:0 auto; padding-top:50px;}
.silianx{ height:350px; width:100%; background-color:#0f0909;}
.silian3x{height:200px; width:80%; margin:auto;}
.silian4x{ height:150px; width:48%;   float:left; margin-left:1%; }
.silian4x2{ height:50px; width:100%;  text-align:center; padding-top:10px; margin-top:50px;  }
.silian4x3{ height:30px; width:100%; text-align:center; color:#FFFFFF; padding-top:20px; font-size:14px;  }
.xiaoti{ height:50px; width:100%; font-size:20px; text-align:center;font-weight:bold;}
.xiaoti2{ height:50px; width:100%; font-size:15px; text-align:center;}
.tupianqu{ height:auto; width:90%;  margin:0 auto;}
.tu1{ height:240px; width:100%; background-image:url(../img/m1.jpg); line-height:240px; font-size:22px; text-align:center; color:#FFFFFF; margin-bottom:10px;}
.tu2{ height:240px; width:100%; background-image:url(../img/m2.jpg); line-height:240px;font-size:22px;text-align:center;color:#FFFFFF;margin-bottom:10px;}
.tu3{ height:240px; width:100%; background-image:url(../img/m3.jpg); line-height:240px;font-size:22px;text-align:center;color:#FFFFFF;margin-bottom:10px;}
.tu4{ height:240px; width:100%; background-image:url(../img/m4.jpg); line-height:240px;font-size:22px;text-align:center;color:#FFFFFF;margin-bottom:10px;}
.tu5{ height:240px; width:100%; background-image:url(../img/m5.jpg); line-height:240px;font-size:22px;text-align:center;color:#FFFFFF; margin-bottom:10px;}
.hezuo{ height:850px; background-color:#000000; padding-top:40px; }
.hezuo2{ height:1500px; background-color:#000000; padding-top:40px;  }
.xiaoti3{ height:40px; width:100%; font-size:20px; text-align:center; color:#fff;}
.xiaoti4{ height:40px; width:100%; font-size:15px; text-align:center;color:#fff; }
.xiaoti4a{ height:40px; width:100%; font-size:15px; text-align:center;color:#fff; }
.santu{ height:1500px; width:90%; margin: 0 auto;}
.ditu1{height:200px; width:93%;border: 1px solid #fff; padding-left:10px; padding-top:15px; padding-right:10px; padding-bottom:20px;}
.ditu2{height:200px; width:93%;border: 1px solid #fff; padding-left:10px; padding-top:15px; padding-right:10px; margin-top:20px;padding-bottom:20px;}
.ditu3{height:200px; width:93%;border: 1px solid #fff; padding-left:10px; padding-top:15px; padding-right:10px; padding-bottom:20px; margin-top:20px;}
.ditu1x{height:360px; width:93%;border: 1px solid #fff; padding-left:10px; padding-top:15px; padding-right:10px; padding-bottom:20px;}
.ditu2x{height:400px; width:93%;border: 1px solid #fff; padding-left:10px; padding-top:15px; padding-right:10px; margin-top:20px;padding-bottom:20px;}
.ditu3x{height:210px; width:93%;border: 1px solid #fff; padding-left:10px; padding-top:15px; padding-right:10px; padding-bottom:20px; margin-top:20px;}
.bbtt{ color:#FFFFFF; font-size:20px; font-weight:bold; }
.bbtt2{ color:#FFFFFF; font-size:16px; height:auto; padding-bottom:20px; width:100%;}
.bbtt2a{ color:#FFFFFF; font-size:16px; height:auto;padding-bottom:20px; }
.bbtt3{ color:#FFFFFF; font-size:16px;}
.dot {
  width: 6px;
  height: 6px;
  background-color: #fff;
  border-radius: 50%;
  float:left; margin-top:10px; margin-right:7px; margin-left:15px;
}
.lie{ font-size:14px; float:left; width:90%;}
.container {
            max-width: 88%;
            width: 88%;
            text-align: center;
        }
        

        .counter-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 30px;
            margin-bottom: 60px;
        }

        .counter-icon {
            font-size: 2.5rem;
            margin-bottom: 15px;
        }
        
        .counter-value {
            font-size: 2rem;
            font-weight: bold;
            margin: 0 0;
            height: 60px;
            display: flex;
            align-items: center;
            justify-content: center;
			float:left;
			margin-left:0%; 
        }
		
  .jiahao{float:left;  width:20%;  padding-top:10px; width:30px;font-weight:bold; font-size:16px;color:#ff0000; }
		.shuju{ height:100px; width:100%; font-size:30px; text-align:center; padding-top:50px;}
		        .counter-label {
            font-size: 1.2rem;
            opacity: 0.9;
			clear:both;
        } 
		.shujux{ width:30%; height:30px; background-color:#CC3333;}
.mingjia{ height:1200px; width:100%; background-color:#000}
.tuandui{ height:720px; background-image:url(../img/tuandui.jpg);}
.hezuo2{ height:800px; background-color:#000000; padding-top:20px; padding-bottom:20px;}
.lianxi{ height:300px; width:100%; background-color:#000000;}
.lianxi2{ height:50px; width:100%; text-align:center; color:#FFFFFF; font-size:20px; color:#FFFFFF; padding-top:50px; padding-bottom:80px;}
.lianxi3{ height:50px; width:200px; margin:0 auto; font-size:20px; background-color:#DBDBEA; text-align:center; line-height:50px;border-radius:50px;border: 3px solid #fff;}
.xiabu{ height:250px; width:100%; background-color:#000000; text-align:center; color:#FFFFFF; padding-top:80px;}
.zuo{ height:200px; width:45%; float:right; color:#FFFFFF;font-size:16px;}
.you{ height:200px; width:45%;float:right;   }
.gunayux{ font-size:24px;}
.dibu2{ height:100px; padding-top:60px;font-size:14px; text-align:center;}
.gaishu{ height:200px; width:100%; background-color:#000000;  color:#FFFFFF; padding-top:50px;background-image:url(../img/heise.png);background-size: 100% 100%; }
.gaishubiaoti{ font-size:17px; height:50px;padding-left:5%; font-weight:bold;}
.gaishuneirong{ font-size:14px; height:50px;padding-left:5%;}
.yewu{ height:50px; width:100%; font-size:24px; text-align:center; padding-top:50px; padding-bottom:50px; }
.yewu2{ height:auto; width:96%; margin:0 auto; }
.ye{ float:left; height:350px; width:48%;  font-size:12px; padding-left:1%;}
.ye1{ height:60px; width:100%; line-height:60px;  font-size:12px; text-align:center; padding-bottom:10px; }
.ye2{  height:auto; width:100%;  font-size:12px;text-align:center;font-size:16px;padding-bottom:20px; font-weight: bold;}
.ye3{ height:auto; width:90%;  font-size:12px;text-align:center; padding-left:10px; padding-right:20px; line-height:25px; padding-bottom:50px; }
.geceng{ clear:both;}
.dabiao{text-align:center; font-size:20px;}
.dabiao2{text-align:center; font-size:15px;}

.gaishu2{ height:400px; width:100%;   padding-top:50px; }
.gaishua{ height:200px; width:100%;  font-size:14px;}
.gaishub{ height:200px; width:100%; text-align:center;}
.heitiao{ height:200px; width:100%; background-color:#000000; color:#FFFFFF; font-size:20px; text-align:center; line-height:200px;}
.heitiao2{ height:150px; width:100%; background-color:#000000; color:#FFFFFF; font-size:20px; text-align:center; padding-top:90px;}
.baitiao{ height:450px; width:95%;  margin:0 auto; padding-top:80px;}
.baitiao2{ height:200px; width:100%;  margin:0 auto; padding-top:40px; margin:0 auto; text-align:center; font-size:18px;}
.yiti{ height:180px; width:80%; margin:0 auto;}
.yiti2{ height:40px; width:100%; text-align:center; font-size:20px; padding-top:50px;}
.yiti3{ height:40px; width:100%; text-align:center; font-size:15px;}
.yiti4{ height:20px; width:100%; text-align:center; font-size:12px; color:#666666;}
.tulie{ height:auto; width:100%; margin:0 auto; background-color:#3333FF; }
.tulie2{ height:250px; width:44%; background-color:#00FFCC; float:left; margin-left:4%; margin-top:20px;  }
.geceng2{ height:50px; width:100%;}
.shuc{ height:200px; width:48%;  float:left; margin-left:1.5%;} 
.shuc1{ height:30px; width:100%; font-size:25px; text-align:center; font-weight:bold; padding-bottom:10px;}
.shuc2{ height:30px; width:100%; font-size:16px; text-align:center; font-weight:bold;}
.shuc3{ height:50px; width:100%; font-size:14px; text-align:center; }
.gaishubiaoti2{ font-size:20px; height:80px;padding-left:5%; padding-right:5%;}
.gaishuneirong2{ font-size:16px; height:50px;padding-left:5%;padding-right:5%; }
.dongtaigu{ height:750px; width:100%; margin:0 auto;}
.dshu{ height:120px; width:45%; float:left; text-align:center; margin-top:50px; margin-left:3%;}
.dshu2{ font-size:25px; font-weight:bold; padding-top:20px; font-size:25px;}
.dshu3{ font-size:16px;}
.hangye{ height:20px; width:100%;  text-align:center; font-size:25px;}
.xinwen{ height:auto; width:95%;margin: 0 auto; margin-top:50px;}
.xinwen2{ height:350px; width:95%;}
.tutu{ height:100px; width:100%;float:left; margin-top:20px; margin:0 auto; text-align:center;margin-bottom:15px;}
.wenzi{ height:100px; width:100%; float:left;}
.wenzi1{ height:auto; width:100%; font-size:20px; padding-bottom:20px;}
.wenzi2{ height:100px; width:100%; font-size:14px;}
.guanyu{ height:500px; width:95%;}
.guanyuy{ height:300px; width:95%;}
.guanyua{ height:auto; width:95%;}
.guanyux{ height:300px; width:100%; }
.lianjiegd{ font-size:20px; font-weight:bold;}
.fentu{ height:280px; width:48%; float:left;  margin-left:2%; margin-top:10px;}
.shangse{ width:100%; height:120px;opacity: 0.8; line-height:120px; text-align:center;}
.fentu2{ background-color:#000000; width:100%; height:120px; }
.fentu3{  width:100%; height:110px; font-size:15px; text-align:left; padding-top:10px;}
.fentu4{  width:100%; height:90px; font-size:12px; text-align:left; }
.qukuai{ min-height: 100%; }
.shoujidh{ height:50px; width:100px;}
        :root {
            --primary-color: #4a6cf7;
            --secondary-color: #6b7280;
            --hover-color: #f3f4f6;
            --active-color: #e5e7eb;
            --text-color: #1f2937;
            --border-color: #d1d5db;
            --transition: all 0.3s ease;
        }

        

        .container {
            max-width: 100%;
            width: 100%;
            margin: 0 auto;
        }

        /* 基础Tab样式 */
        .tabs-basic {
            display: flex;
            border-bottom: 1px solid var(--border-color);
            margin-bottom: 1.5rem;
        }

        .tab-btn {
            padding: 0.75rem 1.5rem;
            background: transparent;
            border: none;
            cursor: pointer;
            font-size: 1rem;
            color: var(--secondary-color);
            transition: var(--transition);
            position: relative;
        }

        .tab-btn:hover {
            color: var(--primary-color);
            background: var(--hover-color);
        }

        .tab-btn.active {
            color: var(--primary-color);
            font-weight: 600;
			
        }

        .tab-btn.active::after {
            content: '';
            position: absolute;
            bottom: -1px;
            left: 0;
            width: 100%;
            height: 3px;
            background: var(--primary-color);
            border-radius: 3px 3px 0 0;
			
        }

        .tab-content {
            display: none;
            padding: 1.5rem;
            animation: fadeIn 0.5s ease;  
        }

        .tab-content.active {
            display: block;
        }

       

        

        /* 动画效果 */
        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(10px); }
            to { opacity: 1; transform: translateY(0); }
        }

        /* 响应式设计 */
        @media (max-width: 768px) {
            .tabs-basic, .tabs-icons, .tabs-underline {
                flex-wrap: wrap;
            }
            
            .tab-btn, .tab-icon, .tab-underline {
                flex: 1 0 50%;
            }
            
            .tabs-rounded {
                width: 100%;
                overflow-x: auto;
            }
        } 
		
		
		

        /* 顶部栏样式 */
        .top-bar {
            background: #CCCCCC; height:20px; width:20px;
			border-radius: 5px;
            color: white;
            padding: 10px 10px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
            position: relative;
            z-index: 100;
        }
        
        .logo {
            font-size: 1.3rem;
            font-weight: bold;
            display: flex;
            align-items: center;
        }
        
        .logo i {
            margin-right: 10px;
            font-size: 1.5rem;
        }
        
        /* 导航按钮样式 - 右侧 */
        .nav-toggle {
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            width: 30px;
            height: 21px;
            cursor: pointer;
            transition: transform 0.3s;
        }
        
        .nav-toggle:hover {
            transform: scale(1.1);
        }
        
        .nav-toggle span {
            display: block;
            height: 3px;
            width: 100%;
            background-color: white;
            border-radius: 3px;
            transition: all 0.3s ease;
        }
        
        .nav-toggle.active span:nth-child(1) {
            transform: translateY(9px) rotate(45deg);
        }
        
        .nav-toggle.active span:nth-child(2) {
            opacity: 0;
        }
        
        .nav-toggle.active span:nth-child(3) {
            transform: translateY(-9px) rotate(-45deg);
        }
        
        /* 主导航菜单样式 */
        .nav-menu {
            position: fixed;
            top: -100%;
            left: 0;
            width: 100%;
            height: 100%;
            background: linear-gradient(135deg, #2c3e50, #34495e);
            z-index: 99;
            transition: top 0.5s cubic-bezier(0.4, 0, 0.2, 1);
            box-shadow: 0 5px 25px rgba(0, 0, 0, 0.2);
            border-radius: 0 0 0px 0px;
           
        }
        
        .nav-menu.active {
            top: 0;
        }
        
        .nav-header {
            padding: 20px;
            background: rgba(0, 0, 0, 0.2);
            display: flex;
            justify-content: space-between;
            align-items: center;
            border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        }
        
        .nav-title {
            font-size: 1.3rem;
            font-weight: bold;
            display: flex;
            align-items: center;
        }
        
        .nav-title i {
            margin-right: 10px;
            color: #6a11cb;
        }
        
        .nav-close {
            background: rgba(255, 255, 255, 0.1);
            border: none;
            color: white;
            font-size: 1.2rem;
            cursor: pointer;
            width: 40px;
            height: 40px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            transition: all 0.3s;
        }
        
        .nav-close:hover {
            background: rgba(255, 255, 255, 0.2);
            transform: rotate(90deg);
        }
        
        .nav-items {
            list-style: none;
            padding: 10px 10px 15px;
            max-height: 100%;
            overflow-y: auto;
			font-size:18px;
        }
        
        .nav-items > li {
            margin-bottom: 5px;
        }
        
        .nav-items a {
            color: white;
            text-decoration: none;
            font-weight: 500;
            display: flex;
            align-items: center;
            padding:0.5px 0.5px;
			height:18px;
            border-radius: 5px;
            transition: all 0.3s;
            position: relative;
            overflow: hidden;
        }
        
        .nav-items a::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
            transition: left 0.5s;
        }
        
        .nav-items a:hover::before {
            left: 100%;
        }
        
        .nav-items a i {
            margin-right: 15px;
            font-size: 1.3rem;
            width: 24px;
            text-align: center;
            transition: transform 0.3s;
        }
        
        .nav-items a:hover {
            background: rgba(255, 255, 255, 0.1);
            transform: translateX(5px);
        }
        
        .nav-items a:hover i {
            transform: scale(1.2);
            color: #6a11cb;
        }
        
        /* 二级菜单样式 */
        .has-submenu > a::after {
            content: '›';
            margin-left: auto;
            font-size: 1.5rem;
            transition: transform 0.3s ease;
        }
        
        .has-submenu.active > a::after {
            transform: rotate(90deg);
            color: #6a11cb;
        }
        
        .submenu {
            background: rgba(0, 0, 0, 0.2);
            border-radius: 8px;
            margin: 8px 0;
            overflow: hidden;
            max-height: 0;
            transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        .has-submenu.active .submenu {
            max-height: 500px;
        }
        
        .submenu li {
            list-style: none;
            opacity: 0;
            transform: translateY(-10px);
            transition: all 0.3s ease;
        }
        
        .has-submenu.active .submenu li {
            opacity: 1;
            transform: translateY(0);
        }
        
        /* 为每个子菜单项添加延迟动画 */
        .has-submenu.active .submenu li:nth-child(1) { transition-delay: 0.05s; }
        .has-submenu.active .submenu li:nth-child(2) { transition-delay: 0.1s; }
        .has-submenu.active .submenu li:nth-child(3) { transition-delay: 0.15s; }
        .has-submenu.active .submenu li:nth-child(4) { transition-delay: 0.2s; }
        .has-submenu.active .submenu li:nth-child(5) { transition-delay: 0.25s; }
        
        .submenu a {
            padding-left: 55px;
            font-size: 0.95rem;
            color: rgba(255, 255, 255, 0.9);
            border-radius: 0;
            background: transparent !important;
        }
        
        .submenu a:hover {
            background: rgba(255, 255, 255, 0.05) !important;
            transform: none;
            padding-left: 60px;
        }
        
        /* 覆盖层 */
        .overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.5);
            z-index: 98;
            display: none;
            backdrop-filter: blur(2px);
        }
        
        .overlay.active {
            display: block;
            animation: fadeIn 0.3s ease;
        }
        
        @keyframes fadeIn {
            from { opacity: 0; }
            to { opacity: 1; }
        }
        
        /* 内容区域样式 */
        .content {
            padding: 30px 20px;
            max-width: 1200px;
            margin: 0 auto;
        }
        
        h1 {
            margin-bottom: 20px;
            color: #2c3e50;
            border-bottom: 2px solid #6a11cb;
            padding-bottom: 10px;
        }
        
        p {
            margin-bottom: 15px;
        }
        
        .features {
            display: flex;
            flex-wrap: wrap;
            gap: 20px;
            margin-top: 30px;
        }
        
        .feature {
            flex: 1;
            min-width: 250px;
            background: white;
            padding: 25px;
            border-radius: 12px;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
            transition: transform 0.3s, box-shadow 0.3s;
            border-top: 4px solid #6a11cb;
        }
        
        .feature:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
        }
        
        .feature h3 {
            color: #2c3e50;
            margin-bottom: 12px;
            display: flex;
            align-items: center;
        }
        
        .feature h3 i {
            margin-right: 12px;
            color: #6a11cb;
            font-size: 1.3rem;
        }
        
        .demo-section {
            margin-top: 40px;
            padding: 25px;
            background: linear-gradient(135deg, #e8f4fc, #d4e6f1);
            border-radius: 12px;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
        }
        
        .demo-section h2 {
            color: #2c3e50;
            margin-bottom: 15px;
            display: flex;
            align-items: center;
        }
        
        .demo-section h2 i {
            margin-right: 10px;
            color: #6a11cb;
        }
        
        .instructions {
            background: #fff8e1;
            padding: 18px;
            border-radius: 8px;
            margin: 20px 0;
            border-left: 4px solid #ffc107;
            box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
        }
        
        /* 代码展示区域 */
        .code-container {
            background-color: #2d2d2d;
            color: #f8f8f2;
            padding: 25px;
            border-radius: 12px;
            margin-top: 30px;
            overflow-x: auto;
            font-family: 'Courier New', monospace;
            font-size: 14px;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
        }
        
        .code-container h3 {
            color: #f8f8f2;
            margin-bottom: 15px;
            border-bottom: 1px solid #444;
            padding-bottom: 10px;
        }
        
        .code-comment {
            color: #75715e;
        }
        
        .code-tag {
            color: #f92672;
        }
        
        .code-attr {
            color: #a6e22e;
        }
        
        .code-value {
            color: #e6db74;
        }
        
        .code-keyword {
            color: #66d9ef;
        }
        
        /* 响应式调整 */
        @media (min-width: 768px) {
            .nav-menu {
                width: 400px;
                left: auto;
                right: 0;
                border-radius: 0 0 0 20px;
            }
        }
        
        @media (max-width: 480px) {
            .top-bar {
                padding: 12px 15px;
            }
            
            .logo {
                font-size: 1.1rem;
            }
            
            .nav-items {
                padding: 10px 15px 20px;
            }
            
            .nav-items a {
                padding: 14px 12px;
            }
        }
.yingwen{text-align:center; font-size:20px;}  
.zhongwen{text-align:center; font-size:25px;}	
.gaishuneirongx{  height:50px;padding-left:5%; padding-right:5%; font-size:16px;}
.shanghu{ height:100px; width:100%; background-color:#55555;}
.shushu1{font-size:30px;color:#ff0000; float:left; width:60px;font-weight:bold;}
.shushu2{font-size:30px;color:#ff0000; float:left; width:60px;font-weight:bold}
.shushu3{font-size:30px;color:#ff0000; float:left; width:88px;font-weight:bold}
.shushu4{font-size:30px;color:#ff0000; float:left; width:88px;font-weight:bold}
.gaogao1{height:30px; width:66%; padding-left:37%; }
.gaogao2{height:30px; width:66%; padding-left:37%;}
.gaogao3{height:30px; width:66%; padding-left:33%;}
.gaogao4{height:30px; width:66%; padding-left:34%;}

}